import * as PIXI from 'pixi.js'
import { createNsSprite } from '@renderer/utils/bundle'
import param, { rightHeightUsage } from '../../param'
import { diyOpenInputClick } from '@renderer/utils/events'
import { setPixi, setPixiData } from '@renderer/store/modules/usePixiStore'
import useDiyStore from '@renderer/store/modules/useDiyStore'

export default async (): Promise<PIXI.Container<PIXI.ContainerChild>> => {
  const diyStore = useDiyStore()
  const container = new PIXI.Container()
  // 标签
  const labelText = new PIXI.Text({
    text: '生命',
    style: {
      fontFamily: 'XQFont',
      fontSize: param.value.fontSize,
      fill: param.value.fill,
      align: 'center',
    },
  })
  labelText.anchor.set(0, 0.5)
  // 输入框
  const inputContainer = new PIXI.Container()
  const inputSprite = await createNsSprite('input', 600, 90)
  inputSprite.scale.set(0.6)
  inputSprite.pivot.set(0, inputSprite.height / 2)
  // 文本
  const text = new PIXI.Text({
    text: '',
    style: {
      fontFamily: 'XQFont',
      fontSize: param.value.fontSize,
      fill: param.value.fill,
      align: 'center',
    },
  })
  text.anchor.set(0.5)
  text.position.set((inputSprite.width / 2) * 0.6, 0) // 注意比例
  inputContainer.addChild(inputSprite, text)
  inputContainer.position.set(labelText.width, 0)
  diyOpenInputClick.whiteAdd(inputContainer) // 绑定点击事件
  setPixi(text.uid, text)
  setPixiData(text.uid, {
    attrName: 'hp',
    defaultValue: '',
  })
  diyStore.setOptionUidMap('hp', text.uid)
  setPixi(inputContainer.uid, inputContainer)
  setPixiData(inputContainer.uid, {
    textUid: text.uid,
  })
  container.addChild(inputContainer, labelText)
  container.position.set(param.value.leftUsageWidth + 40, param.value.startHeight + container.height / 2 + param.value.rightUsageHeight)
  rightHeightUsage(container)
  return container
}
